<template>
  <view>
    <view class="cu-card case">
      <view class="cu-item shadow bg-white padding">
        <view class="flex justify-center round">
          <view class="cuIcon-safe text-green" style="font-size: 50px;"></view>
        </view>
        <view class="flex justify-center">
          <view>积分兑换记录</view>
        </view>
      </view>
      <view class="cu-item shadow bg-white">
        <view class="cu-bar shadow bg-white" v-for="(item,index) in list" :key="index">
          <view class="item_wrap">
            <view class="padding item_credit">{{item.oldCredit}} = > {{item.newCredit}}</view>
            <view class="padding item_remark">{{item.remark}}</view>
            <view class="padding item_change">{{item.change}}</view>
            <view class="padding item_time">{{item.cnTime}}</view>
          </view>
        </view>
      </view>
    </view>
  </view>
</template>

<script>
import moment from "moment";
moment.locale("zh-cn");
export default {
  data() {
    return {
      list: []
    };
  },
  mounted() {
    this.getList();
    console.log(this.list);
  },
  methods: {
    getList() {
      this.request({
        url:
          this.apiServer +
          "/credit/findMyCreditRecordByUId?uId=" +
          uni.getStorageSync("user").id
      }).then(res => {
        res.data.forEach(v => {
          v.cnTime = moment(v.createTime).format("YYYY-MM-DD HH:mm:ss");
        });
        this.list = res.data;
      });
    }
  }
};
</script>

<style lang="scss" scoped>
.item_wrap {
  display: flex;
  justify-content: space-around;
  // .padding{
  //   flex: 1;
  //   display: flex;
  //   justify-content: center;
  //   align-items: center;
  //   font-size: 15px;
  // }

  .item_credit {
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .item_remark {
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #000;
    font-weight: 400;
  }
  .item_change {
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .item_time {
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #ccc;
    font-size: 11px;
  }
}
</style>